<template>
  <view class="">
    <view class="top">
      <!-- 搜索框 -->
      <!-- <view class="topbox">
				<view class="inputbox">
					<image src="https://fangguaner.wm76.mtnet.ren/static/applet/sousuo.png" mode=""></image>
					<input type="text" value="" placeholder="请输入房源编号/名称" @confirm="shurukuang" />
				</view>
			</view> -->

      <!-- 图片导航 -->
      <view class="imgnav">
        <view
          class="imgbox"
          v-for="(item, index) in arr"
          :key="index"
          @click="imgnav(index, item.text)"
        >
          <image :src="item.img" mode=""></image>
          <view class="text">
            {{ item.text }}
          </view>
        </view>
      </view>
    </view>

    <!-- 我的数据 -->

    <view class="databox">
      <view class="timebox">
        <view class="mydata"> 我的数据 </view>
        <view class="nowtime">
          <view
            class="time"
            v-for="(item, index) in arr1"
            :key="index"
            @click="time(index, item)"
            :class="currentindex === index ? 'specil' : ''"
          >
            {{ item.text }}
          </view>
        </view>
      </view>

      <!-- 具体数据 -->
      <view class="detail">
        <view class="boxs">
          <view class="one">
            {{ obj.man.now || 0 }}
          </view>
          <view class="two"> {{ times }}{{ obj.man.previous || 0 }} </view>
          <view class="three"> 新增客户 </view>
        </view>
        <view class="boxs">
          <view class="one">
            {{ obj.house.now || 0 }}
          </view>
          <view class="two"> {{ times }}{{ obj.house.previous || 0 }} </view>
          <view class="three"> 新增房源 </view>
        </view>
        <view class="boxs">
          <view class="one">
            {{ obj.landlordorlandlady.now || 0 }}
          </view>
          <view class="two">
            {{ times }}{{ obj.landlordorlandlady.previous || 0 }}
          </view>
          <view class="three"> 新增房东 </view>
        </view>
        <view class="boxs">
          <view class="one">
            {{ obj.invitation.now || 0 }}
          </view>
          <view class="two">
            {{ times }}{{ obj.invitation.previous || 0 }}
          </view>
          <view class="three"> 邀约客户 </view>
        </view>
        <view class="boxs">
          <view class="one">
            {{ obj.transaction.now || 0 }}
          </view>
          <view class="two">
            {{ times }}{{ obj.transaction.previous || 0 }}
          </view>
          <view class="three"> 成交订单数 </view>
        </view>
        <view class="boxs">
          <view class="one">
            {{ obj.takealook.now || 0 }}
          </view>
          <view class="two">
            {{ times }}{{ obj.takealook.previous || 0 }}
          </view>
          <view class="three"> 今日带看 </view>
        </view>
      </view>

      <!-- 常用工具 -->
      <view class="instrument"> 常用工具 </view>
      <view class="instrumentbox">
        <view
          class="instrumentimg"
          v-for="(item, index) in arr3"
          :key="index"
          @click="tool(item)"
        >
          <image class="imageone" :src="item.img" mode=""></image>
          <view class="texts">
            {{ item.text }}
          </view>
        </view>
      </view>
    </view>
    <!-- <BaseBottom :selectPath="'/pages/homepage/index'"></BaseBottom> -->
  </view>
</template>

<script>
// import BaseBottom from "../../components/BaseBottom/index.vue"
import { gethomepagedata } from "../../api/api/index.js";
var WebIM = require("../../pagesA/utils/WebIM")["default"];

export default {
  data() {
    return {
      type: "tody",
      arr: [
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/huiyuan.png",
          text: "公客池",
        },
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/daba.png",
          text: "本日带看",
        },
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/kehu2.png",
          text: "我的房东",
        },
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/shangchuang.png",
          text: "上传房源",
        },
      ],
      arr1: [
        {
          text: "今日",
        },
        {
          text: "本周",
        },
        {
          text: "本月",
        },
      ],
      times: "昨天",
      currentindex: 0,
      obj: {},
      shurukuangitem: "",
      arr3: [
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/jifen.png",
          text: "积分兑换",
        },
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/jisuanji.png",
          text: "贷款计算器",
        },
        {
          img: "https://fangguaner.wm76.mtnet.ren/static/applet/tu7.png",
          text: "考试答题",
        },
      ],
    };
  },

  methods: {
    time: function (index, item) {
      this.currentindex = index;
      if (item.text == "今日") {
        this.times = "昨天";
        this.type = "tody";
        this.public();
      } else if (item.text == "本周") {
        this.times = "上周";
        this.type = "week";
        this.public();
      } else if (item.text == "本月") {
        this.times = "上月";
        this.type = "month";
        this.public();
      }
    },
    public() {
      let data = { type: this.type };
      gethomepagedata(data).then((res) => {
        this.obj = res.data;
      });
    },
    // 工具
    tool(item) {
      if (item.text == "考试答题") {
        this.jumpLink({ link: "/pages/Thetitlelist/index" });
      }
      if (item.text == "积分兑换") {
        this.jumpLink({ link: "/pages/creditsexchange/index" });
      }
    },
    imgnav(index, item) {
      if (item == "上传房源") {
        this.$store.state.text = "二手房";
		this.jumpLink({ link: "/pages/uplaoding/index" });
      }
      if (item == "本日带看") {
		  this.jumpLink({ link: "/pages/Todaywithsee/index" });
      }
      if (item == "公客池") {
        this.jumpLink({ link: "/pages/pond/index" });
      }
      if (item == "我的房东") {
        this.jumpLink({ link: "/pages/Mylandlord/index" });
      }
    },
    shurukuang(e) {
      this.shurukuangitem = e.detail.value;
    },
    userpage() {
      uni.removeStorageSync("identity");
      uni.removeStorageSync("token");
      this.$store.commit("changeCheckLogin", false);
      this.jumpLink({
        link: "/pages/home/index",
      });
    },
  },
  components: {
    // BaseBottom
  },
  onLoad() {
    let flag = uni.getStorageSync("flag");
    if (flag == 2) {
      uni.showModal({
        title: "是否重置初始密码？",
        success: (res) => {
          if (res.confirm == true) {
            this.jumpLink({
              link: "/pages/resetpasswords/index",
            });
          } else {
            uni.setStorageSync("flag", 1);
          }
        },
      });
    }
  },
  onShow() {
    this.public();
    let imData = uni.getStorageSync("imData");
    if (imData && !this.$store.state.imLogin) {
      getApp().globalData.conn.open({
        apiUrl: WebIM.config.apiURL,
        user: imData.user,
        //   user: "opp123",
        pwd: imData.pwd,
        //   grant_type: "password",
        appKey: WebIM.config.appkey,
        success: () => {
          this.$store.state.imLogin = true
          console.log('自动初始化成功')
          uni.hideLoading();
        },
        error: () => {
          uni.hideLoading();
          debugger;
        },
      });
    }
  },
};
</script>

<style scoped>
.top {
  height: 432rpx;
  background-color: #ce3d3a;
  padding-top: 20rpx;
  box-sizing: border-box;
}

.topbox {
  display: flex;
  align-items: center;
}

.topbox > image {
  width: 80rpx;
  height: 80rpx;
}

.inputbox {
  height: 80rpx;
  width: 100%;
  margin-left: 25rpx;
  margin-right: 20rpx;
  background-color: #ffffff;
  border-radius: 10rpx;
  display: flex;
}

.inputbox > image {
  width: 35rpx;
  height: 35rpx;
  margin-top: 25rpx;
  margin-left: 25rpx;
}

.inputbox > input {
  width: 610rpx;
  margin-top: 16rpx;
  font-size: 24rpx;
  margin-left: 22rpx;
}

/* 图片导航 */
.imgnav {
  display: flex;
  justify-content: space-between;
  margin-top: 35rpx;
  margin-left: 35rpx;
  margin-right: 35rpx;
}

.imgbox > image {
  width: 110rpx;
  height: 110rpx;
}

.imgbox > .text {
  font-size: 26rpx;
  color: #ffffff;
  font-family: MicrosoftYaHei;
  text-align: center;
}

/* 我的数据 */
.databox {
  height: 500rpx;
  background-color: #ffffff;
  box-shadow: 0rpx 2rpx 15rpx 1rpx rgba(26, 0, 1, 0.1);
  border-radius: 20rpx;
  margin-top: -96rpx;
  margin-left: 20rpx;
  margin-right: 20rpx;
  padding: 40rpx 36rpx;
  box-sizing: border-box;
}

.timebox {
  display: flex;
  justify-content: space-between;
}

.mydata {
  font-size: 36rpx;
  font-family: MicrosoftYaHei-Bold;
  color: #000000;
  font-weight: 700;
}

.nowtime {
  display: flex;
  justify-content: space-between;
}

.time {
  font-size: 24rpx;
  font-family: MicrosoftYaHei;
  color: #4b4a4a;
  width: 96rpx;
  height: 46rpx;
  line-height: 46rpx;
  text-align: center;
  border-radius: 23rpx;
}

/* 选中按钮颜色 */
.specil {
  color: #ffffff;
  background-color: #f6b313;
}

/* 具体数据 */
.detail {
  margin-top: 38rpx;
  margin-left: 23rpx;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.boxs {
  margin-right: 153rpx;
  margin-bottom: 71rpx;
}

.boxs:nth-child(3) {
  margin-right: 0;
}

.boxs:nth-child(6) {
  margin-right: 0;
}

.one {
  text-align: center;
  color: #eb322e;
  font-family: PingFang-SC-Heavy;
  font-size: 36rpx;
}

.two {
  text-align: center;
  color: #eb322e;
  font-family: PingFang-SC-Heavy;
  font-size: 30rpx;
  margin-top: 10rpx;
}

.three {
  font-family: MicrosoftYaHei;
  font-size: 24rpx;
  color: #444444;
  margin-top: 10rpx;
}

/* 常用工具 */
.instrument {
  font-family: MicrosoftYaHei-Bold;
  font-size: 36rpx;
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0rpx;
  color: #000000;
}

.instrumentbox {
  display: flex;
  justify-content: space-between;
  margin-top: 35rpx;
  margin-bottom: 110rpx;
}

.instrumentimg > image {
  width: 138rpx;
  height: 81rpx;
}

.instrumentimg:nth-child(2) > image {
  width: 112rpx;
  height: 90rpx;
}

.instrumentimg:nth-child(3) > image {
  width: 98rpx;
  height: 97rpx;
}

.texts {
  font-size: 26rpx;
  color: #000000;
  font-family: MicrosoftYaHei;
  text-align: center;
  margin-top: 11rpx;
}

.instrumentimg:nth-child(2) > .texts {
  margin-top: 16rpx;
}

.instrumentimg:nth-child(1) > .texts {
  margin-top: 25rpx;
}
</style>
